<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>div的显示与隐藏</title>
    <style>
        .d1,.d2{
            background-color: #339900;
            display: none;
        }

        .d{
            width: 100px;
            height: 100px;
            border: 1px black solid;

        }
    </style>

    <script src="../js/jquery-1.11.0.min.js"></script>
    <script>
        $(function () {
            $(".btn").click(function () {
                $("div:hidden").show(1000).css("background-color","#339900")

                // $(".d").css("visibility","visible");

            })
        })
    </script>

</head>
<body>

<div class="d d1" >
    中国万岁
</div>
<div class="d d2" >
    世界万岁
</div>
<div class="d d3" >
    宇宙万岁
</div>
<input type="button" value="显示并且改变颜色" class="btn">
</body>
</html>